
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class SettingPage extends StatefulWidget{

  SettingPage({Key? key});

  @override
  State<SettingPage> createState() => _SettingPageState();
}

class _SettingPageState extends State<SettingPage>{

  List<CityResponse> provinceList = [
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
    CityResponse(0,"name"),
  ];
  List<CityResponse> cityList = [
  ];
  List<CityResponse> areaList = [
  ];

  int _counter = 0;

  void _countChanged(int newValue) {
    setState(() {
      _counter = newValue;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Align(
        child: Row(
            children: [
              buildCity(list: provinceList, setCounter: _countChanged,columnNum: 1),
              // buildCity(list: provinceList, /*scroll: scrollController[1],*/columnNum: 2),
              // buildCity(list: provinceList, /*scroll: scrollController[2],*/columnNum: 3),
            ]
        )
    );
  }

  Widget buildCity({required List<CityResponse> list, required void Function(int)? setCounter, required int columnNum, Function? onSelected}) {

    return Expanded(
      flex: 1,
      child: Container(
          height: 200,
          child: list.length != 0 ?
          ListWheelScrollView.useDelegate(
            itemExtent: 50,
            physics: FixedExtentScrollPhysics(),
            onSelectedItemChanged: setCounter,
            childDelegate: ListWheelChildBuilderDelegate(
                builder: (context, index) {
                  return  Center(
                      child: Text(
                        "${index>9 ? "" : "0"}$index",
                        style: TextStyle(
                            fontSize: _counter == index ? 36 : 12,
                            color: Colors.white,
                            fontWeight: FontWeight.w600),
                      )
                  );
                },
                childCount: 24),
          )
          // CupertinoPicker.builder(
          //   // scrollController: scroll,
          //   itemExtent: 30,
          //   useMagnifier: true,
          //   magnification: 2,
          //   selectionOverlay: null,
          //   diameterRatio: 2,
          //   squeeze: 1,
          //   onSelectedItemChanged: (int _index) {
          //   },
          //   itemBuilder: (context, index) {
          //     return Center(
          //         child: Text(
          //           "${list[index].name}",
          //           style: TextStyle(
          //               fontSize: 14,
          //               color: Colors.white,
          //               fontWeight: FontWeight.w600),
          //         ));
          //   },
          //   childCount: list.length,
          // )
              : Container()),
    );
  }

}

class CityResponse {
  int id;
  String name;

  CityResponse(this.id, this.name);
}